<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>电商大数据管理平台</title>
		<link rel="icon" href="icon.ico">
		<link rel="stylesheet" href="plugins/bootstrap/css/bootstrap.css">
		<link rel="stylesheet" href="css/dashboard.css">
		<!--[if lt IE 9]>
	    <script src="plugins/html5shiv/html5shiv.min.js"></script>
	    <script src="plugins/respond/respond.min.js"></script>
	    <![endif]-->
	    <style>
	    	@media (max-width: 1336px) {
	    		.index-content{
		    		margin: auto;
		    		margin-top: 20px;
		    	}
		    .index-box{
	    		height: 328px !important;
	    		padding: 60px !important;

	    	}
	    	.index-box img{
	    		width: 100px !important;
	    	}
	    	.index-box h1{
	    		text-align: center;
	    		margin-top: 20px;
	    		font-size: 40px !important;
	    	}
	    	.index-box h4{
	    		margin-top: 20px;
	    	}
	    	.index-box2{
	    		height: 160px !important;
	    		padding: 20px 0 !important;
	    		
	    	}
	    	.index-box3{
	    		height: 160px !important;
	    		padding: 20px 0 !important;
	    		
	    	}
	    	.index-box2 img,.index-box3 img{
	    		width: 80px !important;
	    	}
	    	.index-box2 h1,.index-box3 h1{
	    		font-size: 18px !important;
	    	}
	    	}
	    	body{
	    		/*background-color: #167cc6;*/
	    		background-image: url(images/bgs.png);
	    		background-size: cover;
	    	}
	    	.index-content{
	    		width: 80%;
	    		margin: auto;
	    		margin-top: 50px;
	    	}
	    	.index-box{
	    		height: 428px;
	    		width: 100%;
	    		background-color: white;
	    		padding: 90px;
	    		text-align: center;
	    		cursor: pointer;
	    		border-radius:2px ;
				background-image:url(images/tb.png);
				background-size: cover;
	    	}
	    	.index-box img{
	    		display: block;
	    		width: 140px;
	    		margin: auto;
	    	}
	    	.index-box h1{
	    		text-align: center;
	    		margin-top: 20px;
	    		font-size: 50px;
	    	}
	    	.index-box h4{
	    		margin-top: 20px;
	    	}
	    	.index-box2{
	    		cursor: pointer;
	    		height: 210px;
	    		width: 100%;
	    		background-color: rgba(255,255,255,0.6);
	    		border-radius:2px ;
	    		padding: 40px 0;
	    		
	    	}
	    	.index-box3{
	    		cursor: pointer;
	    		height: 210px;
	    		width: 100%;
	    		background-color: rgba(255,255,255,0.4);
	    		border-radius:2px ;
	    		padding: 40px 0;
	    		
	    	}
	    	.index-box2:hover,.index-box3:hover{
	    		transform: rotateY(180deg);
	    		transition: 2s;
	    	}
	    	.index-box2 img,.index-box3 img{
	    		display: block;
	    		width: 100px;
	    		margin: auto;
	    	}
	    	.index-box2 h1,.index-box3 h1{
	    		text-align: center;
	    		margin-top: 20px;
	    		font-size: 24px;
	    		color: white;
	    	}
	    	.row *{
	    		padding-left: 6px !important;
	    		padding-right: 6px !important;
	    	}
	    	.runbox{
	    		animation: myfirst 6s infinite ease-in-out;
	    	}
	    	@keyframes myfirst
				{
				from {
					transform: rotateY(0deg);
	    		}
				to {
					transform: rotateY(360deg);
				}
				}
			
	    </style>
	</head>

	<body>
	<div id="app">
		<nav class="navbar navbar-default navbar-fixed-top" style="background-color: #2196f3;box-shadow: 0 2px 4px rgba(0,0,0,0.4);">
			<div class="container-fluid">
				<div class="navbar-header">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
					<a class="navbar-brand" href="#" style="font-size: x-large;"><strong><b>电商大数据管理平台</b> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</strong></a>
				</div>
				<navbars :acv='bnav'></navbars>
			</div>
		</nav>

		<div class="container-fluid">
			<div class="index-content">
			<div class="row">
				<div class="col-lg-6">
					<div class="index-box" @click="gourl('platformManage.html')">
						<img src="images/i1.png">
						<h1>大数据平台管理</h1>
						<h4>Big data platform management</h4>
					</div>
				</div>
				<div class="col-lg-6">
					<div class="row">
						<div class="col-lg-6">
							<div class="index-box3 runbox"  style="background-color: #fe4945;animation-delay:2s;" @click="gourl('logisticsManage.html')">
								<img src="images/i2.png">
								<h1>物流管理</h1>
							</div>
						</div>
						<div class="col-lg-6">
							<div class="index-box2"  @click="gourl('siteManage.html')">
								<img src="images/i3.png">
								<h1>服务站管理</h1>
							</div>
						</div>
					</div>
					<div class="row" style="margin-top: 8px;">
						<div class="col-lg-4">
							<div class="index-box2" @click="gourl('trainManage.html')" style="background-color: #fdc635;">
								<img src="images/i4.png">
								<h1>人才培训管理</h1>
							</div>
						</div>
						<div class="col-lg-4">
							<div class="index-box2" @click="gourl('productManage.html')" style="background-color: #6bc83c;">
								<img src="images/i5.png">
								<h1>产业/产品管理</h1>
							</div>
						</div>
						<div class="col-lg-4 runbox">
							<div class="index-box2" @click="gourl('analysis.html')" style="background-color: #3ab5d4;">
								<img src="images/i6.png">
								<h1>平台分析</h1>
							</div>
						</div>
					</div>
				</div>
			</div>
			
			<div class="row" style="margin-top: 8px;">
				<div class="col-lg-2">
					<div class="index-box3" @click="gourl('logistics.html')">
						<img src="images/i7.png">
						<h1>经营主体分析</h1>
					</div>
				</div>
				<div class="col-lg-2">
					<div class="index-box2" @click="gourl('site.html')" >
						<img src="images/i8.png">
						<h1>客户分析</h1>		
					</div>
				</div>
				<div class="col-lg-2">
					<div class="index-box3 runbox" @click="gourl('product.html')" style="background-color: #f147fc;animation-delay:1s;">
						<img src="images/i9.png">
						<h1>产品分析</h1>		
					</div>
				</div>
				<div class="col-lg-3">
					<div class="index-box3" @click="gourl('sitedata.html')">
						<img src="images/i10.png">
						<h1>报表分析</h1>		
					</div>
				</div>
				<div class="col-lg-3">
					<div class="index-box2" @click="gourl('dataReport.html?years=2017&quarter=1')">
						<img src="images/i11.png">
						<h1>报告分析</h1>		
					</div>
				</div>
			</div>
			
			</div>
		</div>
		</div>

		<script src="plugins/jquery/jquery.min.js"></script>
		<script src="plugins/bootstrap/js/bootstrap.min.js"></script>
		<script src="js/ie10-viewport-bug-workaround.js"></script>
		<script type="text/javascript" src="js/vue.min.js"></script>
		<script type="text/javascript" src="js/nav.js"></script>
		<script>
			new Vue({
				el: "#app",
				data: {
					bnav:{
						number:0,
					},
				},
				computed: {

				},
				mounted: function() {

				},
				methods: {
					gourl:function(val){
						location.href = val;
					}
				}
			});
		</script>
	</body>

</html>